<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
        body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}
    </style>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=sMGTVmGogp0NIKsuLitY2GztkkrUiV8u"></script>

    <script type="text/javascript" src="http://api.map.baidu.com/library/CurveLine/1.5/src/CurveLine.min.js"></script>
    <title>带文字标签的覆盖物</title>
</head>
<body>
<div id="allmap" style="width:500px;height:320px" ></div> <!-- -->
<input type="button" value="添加mark"  onclick="addMark()"/>
<input type="button" value="轨迹"  onclick="trace()"/>


</body>
</html>
<script type="text/javascript">

    // http://lbsyun.baidu.com/index.php?title=jspopular
    // http://developer.baidu.com/map/jsdemo.htm#c1_13

    // 百度地图API功能
    var map = new BMap.Map("allmap");
    var point = new BMap.Point(121.491, 31.233);
    map.centerAndZoom(point, 12);
    ///*
    var marker = new BMap.Marker(point);  // 创建标注
    map.addOverlay(marker);              // 将标注添加到地图中

    var label = new BMap.Label("起点",{offset:new BMap.Size(20,-10)});
    marker.setLabel(label);
    //*/

    function addMark(){
        var marker = new BMap.Marker(point);        // 创建标注

        map.addOverlay(marker);                     // 将标注添加到地图中
        marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
    }


    // 请求后台数据库,拿到用户该行程的点集,再地图上绘制;
    // 就形成了用户此次的行程展示;
    function trace(){
        var beijingPosition=new BMap.Point(121.491, 31.233),
                hangzhouPosition=new BMap.Point(121.591, 31.233),
                taiwanPosition=new BMap.Point(121.491, 31.333);
        var points = [beijingPosition,hangzhouPosition, taiwanPosition];
        var curve = new BMapLib.CurveLine(points, {strokeColor:"blue", strokeWeight:3, strokeOpacity:0.5}); //创建弧线对象
        map.addOverlay(curve); //添加到地图中
        curve.enableEditing(); //开启编辑功能
    }

</script>
